<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Document</title>
</head>

<body>
  <div id="app" style="color: red;font-size: 20px;">
    <h2>
      {{srr}}
      {{msg}}
    
    </h2>
  </div>
  <script src="./dist//vue.js"></script>
  <script>
    Vue.Mixin({
      created:function a(){
        // console.log('[ nihao ] >', 1)
      }
    })
    Vue.Mixin({
      created:function a(){
        // console.log('[ nihao ] >', 1)
      }
    })
    let vm = new Vue({
      el: "#app",
      data() {
        return {
          msg: "测试",
          obj: {
            e: "123",
          },
          srr:[{a:1}],
          // name:'111',
          list: [1, 2, 3, 4],
          // lists: [{ name: 'ceshi' }]
        };
      },
      created:function c(){
        // console.log('[ nihao ] >', this.msg)
      },
      beforeUpdate:function c(){
        // console.log('[ nihao ] >', this.msg)
      },
      watch:{
        // 'a'(newValue,oldValue){
        //   console.log('[ 这是watch ] >')
        // }
        msg:{
          handler(old,newdata){
            // console.log('[ handler ] >',old,newdata)
          },
          immediate:true
        }
        // console.log('[ nihao ] >', this.msg)
      },
    });
    // vm._data.obj = {
    //   name: "姓名",
    // };

    // vm._data.objs = {
    //   namess: "姓名",
    // };
    // setTimeout(()=>{
    //   // 实现数据更新 视图自动更新
    //   // vue中更新策略是以组件为单位的给每个组件添加一个watcher
    //   vm.msg = '张四'
    //   vm.srr.push({b:2})
    //   vm.$nextTick(()=>{
    //     // console.log('[ 自己的 ] >',this)
    //   })
    //   // vm._update(vm._render())
    // },500)
    vm.msg = '111'
    // console.log("vm", vm.list);
  </script>
</body>

</html>